<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/common.jsp"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@ include file="/WEB-INF/jsp/importHead.jsp"%>
<%@ include file="/WEB-INF/jsp/importCommonCss.jsp"%>
<link rel="stylesheet" type="text/css" href="${basePath }/css/index-old.css" />
<style>

.show_met_16_1 .nav {
	border: 1px solid #e4eaec;
}
.show_met_16_1 .nav .nav-link{
	color: #62a8ea;
	border-top-left-radius: unset;
	border-top-right-radius: unset;
}

.show_met_16_1 .nav .nav-link.active{
	color: #FFF;
    background-color: #0075c1;
}

.show_met_16_1 .nav .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover{
	color: #FFF;
    background-color: #0075c1;
}

.custom-nav{
	width: 160px;
	float: left;
}

.custom-content{
	width: calc(100% - 180px);
	margin-left: 20px;
	float: left;
}

.breadcrumb {
  padding: 8px 15px;
  margin: 0 0 20px;
  list-style: none;
}
.breadcrumb li {
  display: inline-block;
  *display: inline;
  /* IE7 inline-block hack */

  *zoom: 1;
  text-shadow: 0 1px 0 #ffffff;
}
.breadcrumb .divider {
  padding: 0 5px;
  color: #ccc;
}
.breadcrumb .active {
  color: #999999;
}
.red{
	color: red;
}
.bgcolor{
	background-color: #fff;
}
</style>
</head>

<body class="met-navfixed">
	<%@ include file="/WEB-INF/jsp/importHeader.jsp"%>

	<main class="show_met_16_1 met-show-body panel panel-body m-b-0" style="background-color: #F5F5F5;border-top: solid 2px #4ca8d8;">
		<div class="container">
			<ul class="breadcrumb" style="margin-bottom: 5px;">
		      <li><a href="${basePath }">首页</a><span class="divider">></span></li>
		      <li class="active">个人中心</li>
		  	</ul>
		  	
		  	<div class="col-xs-12">
				<div class="custom-nav bgcolor">
				    <ul class="nav nav-list" style="height: 200px;">
				      <li class="nav-item nav-tabs"><a class="nav-link text-xs-center p-t-1" href="${basePath }/personalCenter">个人设置</a></li>
				      <li class="nav-item nav-tabs"><a class="nav-link text-xs-center p-t-1 active" href="${basePath }/changePwd">密码修改</a></li>
				      <li class="nav-item nav-tabs"><a class="nav-link text-xs-center p-t-1" href="${basePath }/sendAtri?pageNum=1">材料报送</a></li>
				    </ul>
			    </div>
			    
			    <div class="custom-content bgcolor" style="min-height: 400px;border: 1px #dcdcdc solid;padding: 20px;">
			    	<form action="${basePath }/changePwdInfo" method="post" id="changeInfoForm" class="form-horizontal container">
			    		<div class="container-fluid form-group" style="border-bottom: 1px #dcdcdc dashed;padding-bottom: 10px;margin-bottom: 20px;">
							<label class="col-xs-12 form-control-label text-xs-left">
								<h4>修改密码</h4>
							</label>
						</div>
						<div class="container-fluid form-group">
							<label class="col-xs-2 form-control-label text-xs-left">
								原密码：
							</label>
							<div class="col-xs-4">
								<input type="password" name="oldLoginPwd" class="form-control" maxlength="20" />
							</div>
							<label class="col-xs-6 form-control-label text-xs-left error-message red">
								${oldLoginPwdCode }
							</label>
						</div>
						
						<div class="container-fluid form-group">
							<label class="col-xs-2 form-control-label text-xs-left">
								新密码：
							</label>
							<div class="col-xs-4">
								<input type="password" name="loginPwd" class="form-control" maxlength="20" />
							</div>
							<label class="col-xs-6 form-control-label text-xs-left error-message red">
								${loginPwdCode }
							</label>
						</div>
		
						<div class="container-fluid form-group">
							<label class="col-xs-2 form-control-label text-xs-left">
								确认密码：
							</label>
							<div class="col-xs-4">
								<input type="password" name="reLoginPwd" class="form-control" maxlength="20" />
							</div>
							<label class="col-xs-6 form-control-label text-xs-left error-message red">
								${loginPwdCode }
							</label>
						</div>
						
						<c:if test="${!empty result}">
						<div class="container-fluid form-group" id="errorMessageContent">
							<label class="form-control-label red">
								${result }
							</label>
						</div>
						</c:if>
						
						<div class="form-group text-xs-center">
							<button class="btn btn-primary" type="submit">保存</button>		
						</div>
					</form>
			    </div>
		    </div>
		</div>
	</main>


	<%@ include file="/WEB-INF/jsp/importFooter.jsp"%>
	<%@ include file="/WEB-INF/jsp/importCommonJS.jsp"%>
	<script>
		$(function(){
			setTimeout(function(){
				$("#errorMessageContent").slideUp();
			},2000);
			
			$("#changeInfoForm input").bind("focus",function(){
				$(".error-message").hide();
			})
		});
	</script>
</body>
</html>